Загрузить локальный файл json

#javascript #angularjs #json #xmlhttprequest #local

#javascript #angularjs #json #xmlhttprequest #Местные новости

Вопрос:

Я хочу создать простой локальный веб-сайт для визуализации моих данных json, которые генерируются из моих тестов транспортира. Проблема в том, что angular не поддерживает загрузку локальных файлов, поэтому вы знаете, есть ли какой-либо способ, которым я могу использовать этот JSON локально? Я не хочу настраивать сервер только для загрузки одного небольшого файла в одну переменную.

Я пытался $http , но это, очевидно, приводит к сбою XMLHttpRequest Cross origin request . Я ценю любое предложение.

РЕДАКТИРОВАТЬ: я решил запустить http-сервер из npm. Я запускаю его на порту 8080 и указываю путь к моему проекту. Тогда у меня есть

 var app = angular.module("reportingApp", ['nvd3']);

app.controller('MainController', ['$scope', '$rootScope', '$http', function($scope, $rootScope, $http) {
    $scope.title = 'abc';

    $http.get('http://127.0.0.1:8080/e2e-Report/combined.json').success(function(data) {
        $scope.title = data.jsonData;
        });
}]);

по-моему, app.js чтобы получить файл через http , но он выдает No 'Access-Control-Allow-Origin' header is present on the requested resource

1. Angular поддерживает загрузку локального JSON

2. Вы не можете этого сделать

3. это не ограничение angular, это ограничение вашего браузера и функция безопасности. вы бы не хотели, чтобы какой-либо веб-сайт с javascript мог получить доступ к вашему жесткому диску.

4. Итак, нет ли возможного способа чтения локальных файлов?

5. вы можете запустить свой проект на localhost, он будет извлекать локальные данные json…

Ответ №1:

Вы можете создать локальный сервер, установив
npm install http-server -g

Как только он будет установлен, перейдите в командную строку -> Путь к вашему проекту -> http-сервер amp;

Пример.

 D:angularProject> http-server amp; (Press Enter)

Это запустит localhost server: localhost://8080 .
Откройте localhost://8080 в вашем браузере.

Теперь вашей проблемы с CORS не будет. Наслаждайтесь.

РЕДАКТИРОВАТЬ: Вы должны node быть установлены на вашем компьютере.

Пример кода:

 $http.get("api/my.json").then(function (res){
            console.log("res",res);

        })

1. Я сделал это, но после того, как я использую $ http.get (‘ 127.0.0.1:8080/e2e-Report/combined.json’ ), он выдает, что заголовок ‘Access-Control-Allow-Origin’ не присутствует в запрошенном ресурсе

2. Можете ли вы сказать мне, используете ли вы локальный JSON или 127.0.0.1: 8080 / e2e-Report /combined.json’ указывает на какую-то другую машину.

3. Я запускаю http-сервер (тот, что указан в вашем ответе) с путем к моему локальному проекту на моем локальном компьютере в качестве дополнительного параметра.

4. @FCin ваш код должен работать. Можете ли вы попробовать: $http.get(‘e2e-Report/combined.json’).success(функция(данные) { $scope.title = data.jsonData; });

5. он выдает «Перекрестные исходные запросы поддерживаются только для схем протоколов», поэтому он не использует сервер.

Ответ №2:

простой способ используйте некоторые редакторы, такие как скобки, для такого рода работ, с Live view вы получите то, что хотите.