cocos js 移动端加载https图片的问题

首先声明我当前使用的是3.15版本

前言

有时候我们需要把用户的头像，通过url的形式加载出来，然后显示在游戏里，一开始使用的是http，嗯，没错，cocos的那个

downloader

图片中的downloader可以胜任我们的工作，，可是后来慢慢的，我们需要使用https的图片了。。惨了，，试了好几次，基本上都是报超时的错误，偶尔几次可能还可以（莫名其妙）。

修改

废话不多说，我们下面开始修改一下源码：

1

首先打开HttpClient.cpp文件：

HttpClient.cpp

原来的代码是:

// HttpClient implementation
HttpClient* HttpClient::getInstance()
{
    if (_httpClient == nullptr)
    {
        _httpClient = new (std::nothrow) HttpClient();
    }
    
    return _httpClient;
}

改成：

// HttpClient implementation
HttpClient* HttpClient::getInstance()
{
    if (_httpClient == nullptr)
    {
        //设置cURL全局初始化
        curl_global_init(CURL_GLOBAL_DEFAULT);//增加一行，

        _httpClient = new (std::nothrow) HttpClient();
    }
    
    return _httpClient;
}

还有一个地方,原来的代码：

void HttpClient::destroyInstance()
{
    if (nullptr == _httpClient)
    {
        CCLOG("HttpClient singleton is nullptr");
        return;
    }

    CCLOG("HttpClient::destroyInstance begin");
    auto thiz = _httpClient;
    _httpClient = nullptr;

    。。。
}

改成:

void HttpClient::destroyInstance()
{
    if (nullptr == _httpClient)
    {
        CCLOG("HttpClient singleton is nullptr");
        return;
    }

    curl_global_cleanup();//增加一行  清理curl

    CCLOG("HttpClient::destroyInstance begin");
    auto thiz = _httpClient;
    _httpClient = nullptr;

    。。。
}

2

打开CCDownloader-curl.cpp文件

CCDownloader-curl.cpp

原来的代码:

void _initCurlHandleProc(CURL *handle, TaskWrapper& wrapper, bool forContent = false)
  {
            const DownloadTask& task = *wrapper.first;
            const DownloadTaskCURL* coTask = wrapper.second;

            // set url
            curl_easy_setopt(handle, CURLOPT_URL, task.requestURL.c_str());

            // set write func
            if (forContent)
            {
                curl_easy_setopt(handle, CURLOPT_WRITEFUNCTION, DownloaderCURL::Impl::_outputDataCallbackProc);
            }
            else
            {
                curl_easy_setopt(handle, CURLOPT_WRITEFUNCTION, DownloaderCURL::Impl::_outputHeaderCallbackProc);
            }
            curl_easy_setopt(handle, CURLOPT_WRITEDATA, coTask);

        。。。
}

改成：

void _initCurlHandleProc(CURL *handle, TaskWrapper& wrapper, bool forContent = false)
  {
            const DownloadTask& task = *wrapper.first;
            const DownloadTaskCURL* coTask = wrapper.second;

            // set url
            curl_easy_setopt(handle, CURLOPT_URL, task.requestURL.c_str());

            //增加https
            curl_easy_setopt(handle, CURLOPT_SSL_VERIFYPEER, 0);//增加一行

            // set write func
            if (forContent)
            {
                curl_easy_setopt(handle, CURLOPT_WRITEFUNCTION, DownloaderCURL::Impl::_outputDataCallbackProc);
            }
            else
            {
                curl_easy_setopt(handle, CURLOPT_WRITEFUNCTION, DownloaderCURL::Impl::_outputHeaderCallbackProc);
            }
            curl_easy_setopt(handle, CURLOPT_WRITEDATA, coTask);

       。。。
}

3

然后在我们的AppDelegate构造函数中，优先调用一下 HttpClient::getInstance()

修改构造函数

然后我们就能愉快的玩耍了~~~

        var loadImg = buildSprite(this, null, cc.p(0, 0), res.logo_png);
        var imgUrl = "https://upload-images.jianshu.io/upload_images/5109294-2fbc423082a3ebfe.png";
        //imgUrl = "http://bpic.588ku.com/element_origin_min_pic/17/12/25/5296828180d0869d34634a881acad6a1.jpg";
        Log.i("cc.loader.loadImg 1 msg=" + imgUrl);
        cc.loader.loadImg(imgUrl, function (msg, tex) {//异步加载纹理
            Log.i("cc.loader.loadImg 2 msg=" + msg);
            if (tex)
                loadImg.setTexture(tex);
        });

buildSprite函数:

buildSprite: function (parent, pos, anchor, img) {
        var ui = new cc.Sprite();
        ui.initWithFile(img || "");
        ui.setPosition(pos || cc.p(0, 0));
        ui.setAnchorPoint(anchor || cc.p(0.5, 0.5));
        ui.setIgnoreAnchorPointForPosition(false);
        parent.addChild(ui);

        return ui;
    },