不支持请求方法&#39；发布&#39； [英] Request method 'POST' is unsupported

问题描述

以下配置抛出错误‘请求方法’POST‘不受支持’。我已经读到存储API不会在缓存中使用POST作为键的方法来请求对象，但我不知道如何添加路由，这为这些请求显示了一种networkOnly策略。

规格(安装程序取自https://github.com/nystudio107/annotated-webpack-4-config)

• 使用GenerateSW

webpack.settings.js(请记住导入脚本语句)

workboxConfig: {
    swDest: "../sw.js",
    precacheManifestFilename: "js/precache-manifest.[manifestHash].js",
    importScripts: [
        "/dist/workbox-catch-handler.js"
    ],
    exclude: [
        /.(png|jpe?g|gif|svg|webp)$/i,
        /.map$/,
        /^manifest.*\.js(?:on)?$/,
    ],
    globDirectory: "./web/",
    globPatterns: [
        "offline.html",
        "offline.svg"
    ],
    offlineGoogleAnalytics: true,
    runtimeCaching: [
        {
            urlPattern: /.(?:png|jpg|jpeg|svg|webp)$/,
            handler: "cacheFirst",
            options: {
                cacheName: "images",
                expiration: {
                    maxEntries: 20
                }
            }
        }
    ]
}

wepack.prod.js

// webpack.prod.js - production builds
    const LEGACY_CONFIG = 'legacy';
    const MODERN_CONFIG = 'modern';
    const WorkboxPlugin = require('workbox-webpack-plugin');

// config files
    const settings = require('./webpack.settings.js');
    const common = require('./webpack.common.js');
    ...

// Configure Workbox service worker
      const configureWorkbox = () => {
         let config = settings.workboxConfig;

         return config;
      };

// Module Exports – simplified for clarity - see github repro for more details
   module.exports = [
      ...
      ...,
    merge(
       common.modernConfig,
       {
          ...
          ...
          plugins: [
             ...
             new WorkboxPlugin.GenerateSW(
                configureWorkbox()
             ),
          ]
       }
   ]

workbox-Catch-Handler.js

// fallback URLs
   const FALLBACK_HTML_URL = '/offline.html';
   const FALLBACK_IMAGE_URL = '/offline.svg';

// This "catch" handler is triggered when any of the other routes fail to
// generate a response.

   workbox.routing.setCatchHandler(({event, request, url}) => {
      // Use event, request, and url to figure out how to respond.
      // One approach would be to use request.destination, see
      // https://medium.com/dev-channel/service-worker-caching-strategies-based-on-request-types-57411dd7652c

         switch (request.destination) {
            case 'document':
               return caches.match(FALLBACK_HTML_URL);
               break;

            case 'image':
               return caches.match(FALLBACK_IMAGE_URL);
               break;

            default:
               // If we don't have a fallback, just return an error response.
               return Response.error();
         }
   });

// Use a stale-while-revalidate strategy for all other requests.
      workbox.routing.setDefaultHandler(
         workbox.strategies.staleWhileRevalidate()
      );

该错误是由DefaultHandler的策略引起的，因此我尝试在DefaultHandler的正下方为这些请求添加另一个路由，但没有成功。例如：

workbox.routing.registerRoute(
   new RegExp('*/admin/*'),
   workbox.strategies.networkOnly()
);

我也尝试了bgSyncPlugin，但没有成功。如有任何帮助，我们将不胜感激。我想为POST请求(不仅仅是管理URL)实现一个侧宽的networkOnly策略。

推荐答案

您不能使用缓存API缓存POST请求，这意味着您不能使用网络优先策略。

参见：Can service workers cache POST requests?

您可能能够对网络请求执行某些操作(例如，通过读取POST响应并生成新的响应以放入缓存API来更改服务工作器中的请求类型)。这将需要自定义策略。

要使用Workbox路由器访问POST请求，请参阅：https://developers.google.com/web/tools/workbox/modules/workbox-routing#defining_a_route_for_non-get_requests

要编写自己的函数来处理网络请求，请参阅：https://developers.google.com/web/tools/workbox/modules/workbox-routing#matching_and_handling_in_routes

您也许能够重复使用一些工作箱策略，请查看此处了解其工作原理的详细信息：https://developers.google.com/web/tools/workbox/guides/advanced-recipes#make-requests

这篇关于不支持请求方法&#39；发布&#39；的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！