在做Vue整合ueditor中,要显示图片时,数据库中的数据是另一个项目中使用CKeditor存储的相对路径,然而ueditor读取显示的是相对路径。所以在调试中,发现请求资源的路径一直是前端部署地址,localhost:8001,8001是我前端部署地址。所以一直请求不到后端资源。

解决办法:在取到的数据库数据中,将项目的IP地址、端口号和项目资源路径加入src中

/**
 * 用来获取项目部署的IP地址和端口号
 */
@Component
public class ServerConfig implements ApplicationListener<WebServerInitializedEvent> {
    private int serverPort;

    @Override
    public void onApplicationEvent(WebServerInitializedEvent event) {
        this.serverPort = event.getWebServer().getPort();
    }

    public String getUrl() {
        InetAddress address = null;

        try {
            address = InetAddress.getLocalHost();
        } catch (UnknownHostException e) {
            e.printStackTrace();
        }
        assert address != null;
        return "http://"+address.getHostAddress() +":"+this.serverPort;
    }



}

在获取显示数据时,进行数据替换

        String address = serverConfig.getUrl();
        replace = "src=\""+address+"/admin-fast/static/";
        content=content.replaceAll("src=\"",replace);

这样处理之后,ueditor中就能正确显示资源了

Logo

前往低代码交流专区

更多推荐