javascript - 如何在 azure 中托管 json-server

Question

我是软件领域的新手，请耐心等待我的问题和技术术语的错误:

场所:- 我已经使用 Angular4 开发了一个前端应用程序。 Angular 应用程序中定义的 baseURL 是'http://localhost:3000/ '.我的应用程序使用 restangular api 与 json-server 交互(我创建了一个名为 json-server 的文件夹，它有 db.json 和 public 文件夹)。当我使用命令启动 json-server 时，它工作得很好: json 服务器 json 服务器 --watch db.json

我的应用程序已完成，因此我创建了一个生产版本。此后，我将所有文件从 dist 文件夹移动到 json-server 的公用文件夹。当我启动 json-server 时，我的应用程序工作正常。

实际问题:- 现在我想在 azure 中托管。我简单地从 json-server 文件夹中复制了所有文件/文件夹(db.json 和公共(public)文件夹)并将它们放在 azure 云中。当 azure 托管完成后，我在浏览器中打开 url 时出现错误 - “您无权查看”。

为了纠正上述错误，我从 azure 中删除了所有文件，然后复制了 dist 文件夹中的所有文件并将它们放在 azure 云中。使用这个我可以在浏览器中看到应用程序但没有图像。在图像中有一个错误 - 状态响应:URL 为 0:null

当我在本地启动 json-server 时，一切正常，但当然当从其他机器打开同一个网页时，我得到了同样的错误 - 状态响应:0 URL:null

有什么方法可以在 azure 中运行 json-server 以便所有机器/移动设备在访问 url 时都能看到正确的网页而不会出现任何错误。

Answer 1

一步一步运行json-server在 Azure Web 应用程序上:

1. 打开浏览器并转到应用服务编辑器 (https://<your-app-name>.scm.azurewebsites.net/dev/wwwroot/)

2. 在控制台 (Ctrl+Shift+C) 中运行命令

   npm install json-server --save-dev
   

3. 将所有文件/文件夹(db.json 和公共(public)文件夹)放入 wwwroot 文件夹

4. 创建 server.js内容如下

   const jsonServer = require('json-server')
   const server = jsonServer.create()
   const router = jsonServer.router('db.json')
   const middlewares = jsonServer.defaults()
   
   server.use(middlewares)
   server.use(router)
   server.listen(process.env.PORT, () => {
     console.log('JSON Server is running')
   })
   

5. 点击运行 (Ctrl+F5)，这将生成web.config自动归档并在浏览器中打开您的网站。