JSON Caching unterbinden mit meta tag?

Gibt es eine Möglichkeit, das Caching von JSON Dateien im Browser zu unterbinden mit einem meta tag? Bisher tritt das Problem nur in Chrome auf aber dieser Browser ist ja doch sehr populär.

2 Antworten

fab3F

25.10.2023, 21:54

Eigentlich ist die Kontrolle des Cachings von JSON-Dateien mit einem HTML-Meta-Tag aber nicht der empfohlene Ansatz, da dies normalerweise auf Serverebene und über HTTP-Header-Felder gesteuert wird. HTML-Meta-Tags sind in erster Linie für die Steuerung von Metadaten auf der Seite selbst vorgesehen und nicht für die Steuerung des Cachings von Ressourcen.

Woher ich das weiß:eigene Erfahrung

Ginpanse

Fragesteller

25.10.2023, 22:12

Was würdest du mir empfehlen bei einem fremdgehosteten Webserver ohne root Zugriff? Durch den no store tag wird ja das gesamte Caching deaktiviert das wäre negativ

fab3F

25.10.2023, 22:17

@Ginpanse

Ich weiß nicht genau ob das vielleicht geht bzw. ich welchem kontext du die json dateien verwendest aber du könntest das abrufen der datei immer mit einem query-parameter machen. also die url z.b. von "data.json" zu "data.json?v=12345" ändern. Dadurch wird die Datei für den Browser jedes Mal als eine neue Ressource angesehen und nicht gecacht.

Ginpanse

Fragesteller

25.10.2023, 22:20

@fab3F

das klingt gut das versuch ich vielen Dank 🙏🏽

fab3F

25.10.2023, 22:22

@Ginpanse

Viel Erfolg 👍

elenaBC2411

25.10.2023, 22:36

@Ginpanse

Wenn der Provider PHP unterstützt, dann eine php Datei anlegen, in der php die Header setzten und die JSON einbinden. Jetzt noch in deinem Projekt auf die PHP linken - dann sollte das laufen.

<?php
header("Content-Type: application/json");
header("Cache-Control: no-cache, must-revalidate");

require("./meie.json");
?>

Ginpanse

Fragesteller

25.10.2023, 22:49

@elenaBC2411

sogar ohne js werd ich auch probieren top danke 🙏🏽

elenaBC2411

25.10.2023, 22:05

JSON hat keinen Meta-Tag.

Mit dem Header der JSON ein "Cache-Control:" oder "Expires:" ausliefern.

Hallo zusammen,

ich habe folgendes Problem:

Ich hoste meine Website bei Ionos. Dort habe ich meine Codes (HTML, CSS, JavaScript und PHP) im Webspace abgelegt, der mit der Domain verbunden ist.

Nun habe ich an der Website Änderungen vorgenommen und z.B. eine mobile Ansicht implementiert. Ich habe die alten Code-Dateien überschrieben.

Auf der Website werden diese Änderungen aber nicht angezeigt, wenn man die Website vor kurzem bereits besucht hatte, da der Browser-Cache die alten Daten noch gespeichert hat.

Gibt es hier eine Möglichkeit, das zu verhindern und für die Nutzer direkt die neue Version anzeigen zu lassen?

Ich danke für eure Rückmeldungen :)

...zur Frage

Electron Datei Öffnen und Inhalt in Script übergeben?

Ich möchte in meinem Electron Programm im Menü die Möglichkeit bieten eine Datei zu öffnen. Die Datei enthält JSON. Ich möchte den Inhalt dann in meinem Script weiterverarbeiten um ihn anzuzeigen. Das ist mein Code bis jetzt:

main.js

const { app, BrowserWindow, Menu } = require('electron');
const { mainMenu } = require('./menu');
const path = require('path');


const createWindow = () => {
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js'),
        },
    });


    Menu.setApplicationMenu(mainMenu);


    mainWindow.loadFile(path.join(__dirname, "src/index.html"));
};


app.whenReady().then(() => {
    createWindow();


    app.on('activate', () => {
        if (BrowserWindow.getAllWindows().length === 0) {
            createWindow();
        }
    });
});


app.on('window-all-closed', () => {
    if (process.platform !== 'darwin') {
        app.quit();
    }
});

menu.js

const { app, Menu, dialog } = require('electron');
const fs = require('fs');


const template = [
    {
        label: 'Datei',
        submenu: [
            {
                label: 'Öffnen',
                accelerator: 'CmdOrCtrl+O',
                click: async () => {
                    const files = await dialog.showOpenDialog({
                        properties: ['openFile'],
                        filters: [
                            { name: 'Json', extensions: ['json'] },
                            { name: 'Alle Dateien', extensions: ['*'] }
                        ]
                    });


                    if (!files || files.canceled || files.filePaths.length === 0) return


                    const file = files.filePaths[0];
                    const fileContent = fs.readFileSync(file, 'utf-8');
                    console.log(fileContent);
                }
            }
        ]
    }
]


module.exports.mainMenu = Menu.buildFromTemplate(template);

index.html (src/index.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>Seite</h1>
    <script>
        console.log(data);
    </script>
</body>
</html>

Wie kann ich das umsetzten? Ich habe schon von IPC gelesen, es aber nicht wirklich verstanden.

...zur Frage

Wie findet man heraus ob eine Website API-Zugriff gewährt?

Hey, und zwar geht es um die website "www.ufcstats.com", bzw "statsleader.ufc.com".

Ich möchte ein Programm bzw. eine Website entwickeln, in der ich bspw. sagen kann:

"Takedown Accuracy", und dann spuckt er mir den namen von dem Kämpfer mit der höchsten takedown genauigkeit aus, so das man nicht jedesmal nach suchen muss.

Ich hab aber keine ahnung ob es einen API-Zugriff auf die seite gibt, bzw wie man das überhaupt rauskriegt. Weil das ganze mit BeautifulSoup zu machen wird sehr aufwendig.

Vielen dank schonmal.

...zur Frage

Cross Origin Anfrage blockiert?

Ich möchte gerade eine REST-API für mein Heimnetzwerk einrichten um über z.B. einen button einen CMD befehl auf dem Server PC auszuführen.

Mein Pythonscript für die API:

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/execute-command', methods=['POST'])
def execute_command():
  # Hier wird der Code zum Ausführen des Befehls eingefügt
  result = "Befehl wurde ausgeführt."
  return jsonify({"response": result})

if __name__ == '__main__':
  app.run(host='0.0.0.0', port=5000)

Mein HTML Script<!DOCTYPE html>
<html>
<head>
  <title>API Test</title>
</head>
<body>
  <button id="executeBtn">Befehl ausführen</button>
<script>
  document.getElementById('executeBtn').addEventListener('click', function() {
    fetch('http://localhost:5000/execute-command', { // Verwende absolute URL
      method: 'POST',
    })
    .then(response => response.json())
    .then(data => {
      console.log(data);
    })
    .catch(error => {
      console.error('Fehler:', error);
    });
  });
</script>
</body>
</html>

Ich bekomme als Fehler von Firefox in der Konsole:

Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://localhost:5000/execute-command. (Grund: CORS-Anfrage schlug fehl). Statuscode: (null).

Fehler: TypeError: NetworkError when attempting to fetch resource

Entschuldigung wenn es offensichtlich ist, bin da noch sehr frisch und habe keine Lösung gefunden.

...zur Frage

Was soll ich machen mit node.js und Package.json?

Ist directadmin

...zur Frage

JSON von JavaScript-Frontend an Rust-Backend schicken und lesen/speichern?

Genau das was im Titel steht muss umgesetzt werden, aber keine Ahnung wie und ich finde keine nützlichen Informationen dazu, deswegen hoffe ich, dass mir hier jemand helfen kann!

Bisher werden im Frontend Arrays (die Benutzerinformationen enthalten usw.) als JSON zur Local Stroage des Browsers geschickt, um die Informationen dort speichern und wieder lesen zu können; klappt auch ganz gut soweit.

Nun lautet die Aufgabe, die JSON nicht in die Local Storage zu schicken, sondern an ein Backend, das auf der Programmiersprache "Rust" läuft, welches im Prinzip die genau gleichen Aufgaben erfüllen soll wie die Local Storage: Daten empfangen, speichern und wieder schicken können (die andere Option wäre eine Datenbank erstellen und diese mit Rust pflegen, davon habe ich allerdings noch weniger Ahnung).

Klingt im Prinzip ganz simpel, allerdings habe ich sowohl mit Rust als auch mit Backends nicht sonderlich viel Erfahrung, deswegen hänge ich an diesen Schritt fest und komme nicht weiter. Dazu habe ich stand jetzt nichts umsetzen können.

Hat hier denn jemand evtl. Tipps? Ich bin nämlich ein bisschen am Verzweifeln und der Abgabetag dieses Projekts rückt immer näher. 😅

...zur Frage

Javascript & PHP: Wie sortiere ich ein ArrayListe?

Hey Leute, ich hab folgendes Problem...

Ich speichere Scores als Array (username, score) in einem anderen Array, in dem alle Scores mit Namen vorhanden sind.

In meiner Scoreliste möchte ich nun alle Scores sortiert anzeigen. Ich kann die Daten sowohl in PHP, als auch in Javascript sortieren. Kann mir jemanden einen Code geben für eine der beiden Sprachen?

JSON zum Verständnis:

[["max", 1] , ["moritz",2]]

...zur Frage

JavaScript Daten von API abfragen?

Ich habe ein JavaScript Script, in dem ich ganz am Anfang einer Variable die Daten von einem API Request zuweisen muss. Die Daten sollen also in der Variable gespeichert werden und dann der restliche Code ausgeführt werden. Ich möchte, dass die Zuweisung so aussieht:

let data = loadData() | {/*default json*/}

Die Daten müssen da sein bevor der restliche Code ausgeführt wird, da ich sie in einer funktion im onload teil brauche.

...zur Frage

Wie ist eine JSON-Datei aufgebaut?

Genauer gesagt stelle ich mir die Frage, wie ich in einer JSON-Datei zwischen einem Objekt und einer Eigenschaft unterscheide. Sowohl Objekte als auch Eigenschaften und auch die jeweiligen Werte werden ja in Anführungszeichen geschrieben. Bei den Werten kann ich mir das herleiten, da sie rechts vom Doppelpunkt stehen. Dann ist rechts vom Doppelpunkt ja die Eigenschaft.

Und was genau haben die eckigen Klammern zu bedeuten?

...zur Frage

Wieso funktioniert meine "Browser Extension" nicht auf dieser Seite?

Mir ist unter Linux aufgefallen das ich gar nicht den Auto-Scroll von Windows habe in zb. Google Chrome wenn man auf das Mauspad klickt, nutze ich gerne und dachte mir als Challenge ohne Chat Gpt dass ich mal schnell probieren könnte ein eigenes zu programmieren.

Ich weiß da gibt es fertige Software und Extension's, die laufen ohne Probleme und Ressourcen sparender wahrscheinlich.

Hab das erst in einer Html Datei (Extension in "") gemacht zum testen dann in anderen Websites den JS Code in eine Konsole eingefügt und es funktioniert eigentlich ganz gut.

Das Problem ist das ich nicht verstehe wieso er nicht hier funktioniert https://www.tennon.io/ , mir fällt beim inspizieren nichts auf und es scheint mit Next JS umgesetzt zu sein.

<!DOCTYPE html>
<html lang="de">


<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Auto Scroll Extension</title>
    <style>
        html {
            min-width: 100%;
        }
    </style>
</head>


<body>
    <script>
        /* Render Dummy Content, cursor change wont work with min-height */
        for (let i = 0; i < 1000; i++) {
            document.body.innerHTML += "Lorem Ipsum ";
        }
        const scrollSpeed_Up = -1;
        const scrollSpeed_Down = 1;
        const middlehalf = window.innerHeight / 2;
        let AutoScroll_Interval; /* Global acess */
        let isScrolling = false;
        let isScrollingUp = false; /* Default Scrolling Down, Prevent Errors */


        const ToggleScrolling = Enable => {
            if (Enable) {
                console.log("Auto Scroll Active");
                document.body.style.cursor = "all-scroll";
                AutoScroll_Interval = setInterval(AutoScroll, 1);
                isScrolling = true; /* Prevent Multiple Interval's */
            } else if (!Enable && isScrolling) {
                /* Stop Interval , Reset Cursor and Variables */
                console.log("Auto Scroll Stopped");
                document.body.style.cursor = "auto";
                clearInterval(AutoScroll_Interval);
                isScrolling = false;
            }
        }


        const AutoScroll = () => {
            /* Get Current Vertical Scroll Position : console.log(window.scrollY); */
            isScrollingUp ? window.scrollBy(0, scrollSpeed_Up) : window.scrollBy(0, scrollSpeed_Down);
        }


        window.addEventListener("mousemove", e => {
            e.clientY > middlehalf ? isScrollingUp = false : isScrollingUp = true;
        });


        /* Check if Scroll Button is Pressed */
        window.addEventListener("mousedown", e => {
            e.button === 1 && !isScrolling ? ToggleScrolling(true) : ToggleScrolling(false);
        });


        /* ############## IGNORE ##############
        Check if Client has reached Bottom
        const scrollableHeight = document.documentElement.scrollHeight - window.innerHeight;
        if (window.scrollY >= scrollableHeight) { 
            // Reached Bottom Code ... 
        } else {
            // Code ...
        }
        */
    </script>
</body>


</html>

...zur Frage

Javascript verlinken funtioniert nicht?

Hallo,

Ich habe das seltsame Problem, dass ich eine Javascript Datei nicht verlinken kann. Bzw. dass der Inhalt auf der Javascript Datei nicht ausgeführt wird.

So habe ich die Datei im <head> Tag verlinkt:

Der Inhalt auf der Javascript Datei ist folgender:

"use strict"

$("#akzeptieren").click(function() {

$(".cookie").hide();

})

Wenn ich den Javascript Code allerdings in der selben HTML Datei ausführe mit

$("#akzeptieren").click(function() {

$(".cookie").hide();

})

</script>

funktioniert er.

Woran kann das liegen? Ich habe schließlich weitere Javascript Dateien verlinkt die alle funktionieren. Auch habe ich die JQuery Datei im <head> Tag verlinkt. Ich benutze den aktuellen Chrome Browser. Mit Firefox habe ich es auch schon probiert. Dort geht es auch nicht.

Als Editior verwende ich Visual-Studio-Code.

Ich bin gerade ziemlich verwirrt. Habe ich irgendwo einen Fehler gemacht?

...zur Frage

Wie verwendet man eine API auf seiner Webseite?

Hallo,

Ich habe eine online Radio Station. Meine Managementsoftware stellt eine API bereit über die man verschiedene Infos abrufen kann (z.B. den aktuell spielenden Titel, den aktuelle senden DJ, etc...).

Wie binde ich diese Daten nun in meine Webseite ein? Habe sowas noch nie gemacht :)

Meine Webseite läuft mit Wordpress. Die API stellt verschiedene Endpoints bereit.

Danke!

...zur Frage

DIV-Abstand entfernen (HTML/CSS)

Wenn ich meine Datei in DIV-Elemente aufteile, wird im Browser automatisch ein Abstand zwischen diesen eingefügt. Dabei spielt es keine Rolle, ob ich als Browser Chrome oder Firefox verwende. Gibt es eine Möglichkeit das zu unterbinden?

...zur Frage

Javascript Variablen anzeigen?

Gibt es eine Möglichkeit, alle vorhandenen Variablen auf einer geöffneten Webseite anzuzeigen? Ich verwende den Chrome Browser.

Ich meine damit, dass ich eine Webseite öffne und dabei ein Javascript ausgeführt wird, welcher auch variablen erstellt. Diese würde ich gerne ausgeben.

LG Yuns92

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen