如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留链接信息。

thinkjs的调试模式和生产模式,是不同的,这个不同比以往所有的web类型的代码的区别都更加不同。很多新手发现,在生产模式下,访问 http://127.0.0.1:8360/ 的时候,thinkjs的静态资源文件,比如图片/css/js等,都统统404了,然后就一脸茫然了。

这个就是thinkjs新手的必问问题之一:在生产模式下,为什么静态资源都404找不到了。

标准答案

thinkjs的网站切换到生产模式product.js,一般我们推荐的是使用pm2 start pm2.json来切换的,pm2.json里面的script要配置为product.js,还要注意cwd的写法。当然,你也可以直接node product.js简单暴力的执行。这里有pm2的json格式使用指南文章:https://newsn.net/say/pm2-start-json.html

官方推荐:启用对应的webserver的代理模式。一般我们使用nginx来完成这件事情,在thinkjs的代码根目录下面会有个nginxdemo文件,这个文件启用即可。然后我们访问nginx这个服务器,就可以完成静态资源的访问了。当然这个时候,直接访问nodejs8360的话,仍然会是404的。

thinkjs生产模式下,静态资源文件404问题的解决方案 - 002

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-1)

thinkjs生产模式下,静态资源文件404问题的解决方案 - 009

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-2)

注意:thinkjs的默认端口号是8360,不是8630。好多人栽在这里了,当然苏南大叔也是,碰壁好多次之后,才发现端口号不对。

刨根问底

这个事情,如果刨根问底的话,还是要归结于thinkjs下面的resource这个middleware。具体位置位于src/config/middleware.js这个文件中,这里控制了静态资源的访问逻辑。

thinkjs生产模式下,静态资源文件404问题的解决方案 - 003

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-3)

{
  handle: 'resource',
  enable: isDev,
  options: {
    root: path.join(think.ROOT_PATH, 'www'),
    publicPath: /^\/(static|favicon\.ico|(.*)\.txt)/
  }
}

在这里,这个resourcemiddleware,当且仅当开发模式下才会生效,处理的文件必须位于www目录下面,并且必须符合publicPath这个目录,才可以正式生效。

thinkjs生产模式下,静态资源文件404问题的解决方案 - 000

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-4)

thinkjs生产模式下,静态资源文件404问题的解决方案 - 001

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-5)

特别提示

最后附上nginx的测试配置及重新加载配置文件的命令,也许读者朋友可能用的上。比如:如果你找不到你服务器上的配置文件位置的话,执行一下nginx -t就会显示出来你想知道的答案哦~

nginx -t
nginx -s reload

thinkjs生产模式下,静态资源文件404问题的解决方案 - nginx-t

thinkjs生产模式下,静态资源文件404问题的解决方案(图6-6)

额外附赠一篇文章,讲述nginx+pm2+thinkjs的搭建配置过程,希望对读者您有帮助。

云服务器

cmswing作者@特总说:在阿里云服务器上,如果你的代码放置在/root/目录下的话,即使一切都配置正确的话,也会有这种404问题的。这个时候,解决方案就是:换个目录。

据其它云服务器用户反馈,腾讯云服务器上也有一样的问题。所以,请大家,千万不要把代码或者资源放在/root/目录下!!!切记,切记!否则nginxconf文件设置好了www目录,也一样404,没的商量!

结论

当然,如果您实在不想使用nginx去代理node的话,非要直接使用node的话,您也可以修改resource中间件的enable条件。如果你有新的静态资源类型,需要被访问的话,可以修改publicPath参数即可。

nginx上没有太特别的设置,只是将root设置到thinkjswww目录下面,而其他文件,都使用proxy代理到node进行处理罢了。一般这个时候,我们还需要使用pm2来配合启动thinkjs的网站。如果启用了nginx之后,你的还是404的话,请查看修改nginx配置中的root项目,root项目必须指向的是根目录下面的www目录,这个www目录是在middleware源码中的resource中定义的!

这个,就是thinkjs的网站代码,对静态资源文件处理的秘密所在。如果您读懂了本文的内容,那么您就可以处理一系列,您觉得不可思议的相关事项了。世界就是那么奇妙,符合规则即可一切自然。

更多thinkjs的相关内容,请关注苏南大叔的相关文章。https://newsn.net/tag/thinkjs/

  【thinkjs】秘籍文章入口,仅传授于有缘之人  thinkjs

欢迎转载传播本篇原创文章,转载请保留链接及作者信息。
本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享。
转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议。
程序如此灵动~》下所有原创文章,如被用于商业用途,请您按规定支付稿费。

打赏领取小礼物

打赏任意金额,发送截图到邮箱 shang@newsn.net ,可以领取精选回馈如下(任选其一):
  • 《前端视频教程大礼包》一套
  • 《wordpress精选皮肤》一套
  • 《dedecms织梦精选模板》一套
感谢您的打赏,让我更有动力,将更多精彩教程文章,呈现给大家!谢谢!

岁月静好

关注互联网发展,关注苏南大叔的《程序如此灵动~》博客
本文章来自:程序如此灵动~
博客地址为:https://newsn.net/
原文地址为:https://newsn.net/say/thinkjs-resource-404.html
上一篇好文:利用htmltidy编写thinkjs中间件,格式化html代码输出
下一篇好文:thinkjs的中间件,如何传递定制参数

如果您转载了本文章,出于某种原因,并没有注明作者或者出处。
在这里,苏南大叔也表示理解和支持。因为苏南大叔深深地明白:
您会在合适的时机,合适的地方,给本博客一个外链。对吧?
您若开心,便是安好!岁月静好,但愿世界和平,没有纷争~